<template>
  <div class="personalCenter orderLayout">
    <!-- <div class="header">
			<img src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/header-bg.png">
		</div> -->
    <div class="content">
      <img
        class="avatar"
        src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/avatar.png"
      />
      <span class="username">{{ userInfo.username }}</span>
      <div class="info">
        <div>
          <ul>
            <li class="title">已购产品</li>
            <li class="val">
              {{ statisticsData.countProduct
              }}
            </li>
          </ul>
        </div>
        <!-- <div class="line"></div>
        <div>
          <ul>
            <li class="title">现有积分</li>
            <li class="val">
              {{
                statisticsData.puchasePoint -
                statisticsData.disabledPuchasePoint
              }}<span class="gray_info"
                >({{ statisticsData.disabledPuchasePoint }})</span
              >
            </li>
          </ul>
        </div> -->
        <div class="line"></div>
        <div>
          <ul>
            <li class="title">分享人数</li>
            <li class="val">{{ statisticsData.userShare }}</li>
          </ul>
        </div>
      </div>
      <div class="menu">
        <div class="menu-item" @click="toOrderList()">
          <img src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/orderList.png" />
          <span>我的订单</span>
        </div>
        <!-- <div class="menu-item" @click="toScore()">
					<img src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/vip.png">
					<span>我的特权</span>
				</div> -->
        <!-- <div class="menu-item" @click="editMember()">
					<img src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/setting.png">
					<span>个人设置</span>
				</div> -->
      </div>
      <img
        src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/buy2.png"
        style="width: 15.3rem"
        @click="orderPre()"
      />
      <!-- <img
        src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/invite.png"
        class="handle"
        @click="share()"
      /> -->
      <!-- <img src="http://cdn.gee4.cn/zw-wx/wx-vue-img-v2/img/416/banner0328.png" class="banner" @click="goToActive()"> -->
    </div>
    <share-pop :show.sync="showPop"></share-pop>
  </div>
</template>
<script type="text/babel">
import { mapGetters, mapActions } from "vuex";
import sharePop from "components/sharePop";
import { wxshare } from "common/mixin";
export default {
  mixins: [wxshare],
  data() {
    return {
      userInfo: {},
      statisticsData: {},
      showPop: false,
    };
  },
  components: { sharePop },
  methods: {
    ...mapActions({
      GetInfo: "GetInfo",
      GetstatisticsData: "GetstatisticsData",
    }),
    editMember: function () {
      this.$router.push({ path: "setting" });
    },
    toScore: function () {
      this.$router.push({ path: "score" });
    },
    toOrderList: function () {
      location.href = "/order/orderList";
    },
    // 购买页面
    orderPre: function () {
      this.$router.push({ path: "orderPre" });
    },
    share: function () {
      this.showPop = true;
    },
    goToActive() {
      this.$router.push({ path: "convention" });
    },
  },
  created() {
    this.GetInfo().then((result) => {
      this.userInfo = result.data;
      this.GetstatisticsData().then((result) => {
        console.log("result test", result);
        this.statisticsData = result.data;
      });
    });
  },
};
</script>
<style lang="less">
@import "./personalCenter.less";
@import "../order/orderPre.less";
.personalCenter {
  .banner {
    width: 100%;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
  }
}
</style>
